{% extends "base.html" %}
{% from "_when.html" import when_field with context %}
{% block title %}Finish up · {{ app_name }}{% endblock %}
{% block body %}
<h1>{{ '🧺 Take it off' if b.kind == 'wear' else '🦴 Finish up' }}</h1>
<p class="hint">{{ items|map(attribute='name')|join(' · ') }} · on for {{ span|dur }}
  {%- if b.locked %} · 🔒 caged{% endif %}</p>

{#- 🔴 A REFUSED SAVE COMES BACK FILLED IN (#40, web/kept.py): `kv` reads what the refused
    form sent — from this form's own action, or from the "log it as a past bout" button,
    which posts the same fields elsewhere. Rendered server-side, so the words are in the
    page whether or not JavaScript runs; data-kept tells app.js to leave this form alone.
    The error is the page's own flash, right above — this form is the top of the page. -#}
{%- set past_action = '/kit/bout/' ~ b.id ~ '/as-past' -%}
{%- set src = past_action if kept.on(past_action) else action -%}
{%- macro kv(name, default='') -%}{{ kept.value(src, name, default) }}{%- endmacro -%}
<form class="card" method="post" action="{{ action }}"{% if kept.on(src) %} data-kept="server"{% endif %}>
  {% if b.kind == 'play' %}
  <h3>How did it end?</h3>
  <div class="chips pick outcomes">
    {% for o in outcomes %}
    <label class="chip"><input type="radio" name="outcome" value="{{ o }}" {{ 'checked' if o == kv('outcome', 'none') }}>
      {{ {'none': '🚫 nothing', 'edge': '🪢 edged', 'ruined': '💧 ruined', 'squirt': '💦 came'}[o] }}</label>
    {% endfor %}
  </div>
  {% if b.locked %}
  <p class="hint">You're locked, so the app already knows whether it happened in the cage — it doesn't
    have to ask, and it can't be told otherwise.</p>
  {% endif %}
  {% endif %}

  {% if survey %}
  <h3>Questions</h3>
  {#- 🔴 THE SLIDER CARRIES NO `name` UNTIL IT IS MOVED, and that is the whole mechanism.
      An <input type="range"> ALWAYS submits its current value — an untouched one posts the
      midpoint — so the obvious markup silently records a fabricated 5 for every question
      the pup never answered, on a form whose own help text promises the opposite. A field
      with no name is not submitted at all, so "not asked" is the default by construction
      rather than by a rule somewhere downstream.
      ⚠️ It degrades the right way too: with JS off nothing is ever named, so the scores
      are simply absent. The failure mode is losing an answer, never inventing one. -#}
  {#- 🔴 An answer comes back ONLY if it was sent: a kept slider is named and shows its
      value; one the pup never moved was never submitted, so it is still unnamed and still
      "not asked" — keeping the form must not be what fabricates the midpoint. -#}
  {% for q in survey %}
  {%- set ans = kv('score.' ~ q.key) %}
  <div class="checkin ask" data-key="{{ q.key }}">
    <label>{{ q.prompt }}
      <input type="range" data-score="score.{{ q.key }}" min="{{ min }}" max="{{ max }}"
             step="1" {% if ans %}name="score.{{ q.key }}" value="{{ ans }}" class="slider"{% else %}value="{{ ((min + max) // 2) }}" class="slider unanswered"{% endif %}>
    </label>
    <div class="askfoot">
      <output class="hint">{{ (ans ~ ' / ' ~ max) if ans else 'not asked' }}</output>
      <button type="button" class="small clear"{{ '' if ans else ' hidden' }}>× clear</button>
    </div>
  </div>
  {% endfor %}
  <p class="hint">Move a slider to answer it. Anything you leave alone is recorded as
    <b>not asked</b>, never as a zero — the app would rather know nothing than make
    something up.</p>
  {% endif %}

  {% if consumables %}
  <div class="row">
    <label>Used any of
      <select name="consumable_id">
        <option value="">— nothing —</option>
        {% for c in consumables %}<option value="{{ c.id }}"{{ ' selected' if kv('consumable_id') == c.id|string }}>{{ c.cat_icon }} {{ c.name }}</option>{% endfor %}
      </select></label>
    <label>How much <input name="consumable_qty" inputmode="decimal" placeholder="e.g. 5" style="max-width:6rem" value="{{ kv('consumable_qty') }}"></label>
  </div>
  {% endif %}

  <label>Anything to say? <textarea name="note" rows="2" placeholder="optional — this stays off every export that leaves the box">{{ kv('note') }}</textarea></label>
  <button class="primary">Log it</button>
  {#- `min` is the bout's start: a browser will not submit an end before it. -#}
  {{ when_field('⏱ finished earlier? set the time', value=kv('when'), min=started_local,
                extra='It started ' ~ (b.started_at|local) ~ ' — the end can’t be before that.') }}

  {#- 🔴 THE WAY OUT OF "end before start" (#40): the bout was started NOW for something done
      hours ago. Always here (the `min` above means a browser never even sends the bad end),
      opened when that is exactly what was refused. formnovalidate: its own times are checked
      by the server, and `min` belongs to the field above, not to this. -#}
  <details class="past"{{ ' open' if before_start or kept.on(past_action) }}>
    <summary>↶ it all happened earlier — log it as a past bout</summary>
    <p class="hint">Discards this open bout and writes it where it really happened, with everything
      above. Set when it started; the end is <b>finished earlier</b> above, or how long it lasted.</p>
    <div class="row">
      <label>From <input type="datetime-local" name="from" step="60" value="{{ kv('from') }}"></label>
      <label>or lasted <input name="minutes" inputmode="decimal" placeholder="min" style="max-width:6rem" value="{{ kv('minutes') }}"></label>
      <button class="primary" formaction="{{ past_action }}" formnovalidate>Log it as a past bout</button>
    </div>
  </details>
</form>

<form method="post" action="/kit/bout/{{ b.id }}/cancel"
      onsubmit="return confirm('Discard this bout? Nothing about it is recorded.')">
  <button class="small">✕ discard the whole bout</button>
</form>
{% endblock %}